<template>
  <div class="app-container">
    <section>
      <!--工具条-->
      <el-col :span="24" class="toolbar" style="padding-top: 5px;">
        <span
          style="font-size:20px;font-weight: bold; display:block;margin-bottom: 20px;text-align: center;"
        >退货出库单一览</span>
        <el-form :inline="true" :model="formInline">
          <el-form-item label="收货状态">
            <el-select v-model="formInline.ConsigneeStatus" placeholder="收货状态">
              <el-option
                v-for="item in ConsigneeStatus"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select>
            <el-button type="primary" @click="handleDue">查看</el-button>
          </el-form-item>
        </el-form>
      </el-col>

      <el-table :data="tableData" border style="width: 100%;">
        <!--:summary-method="getSum"-->
        <el-table-column prop="PurchaseNo" label="采购单号" align="center"></el-table-column>
        <el-table-column prop="ConsigneeStatus" label="收货状态" align="center">
          <template slot-scope="scope">
            <div>
              <span v-if="scope.row.ConsigneeStatus==1">已收货</span>
              <span v-if="scope.row.ConsigneeStatus==2">未收货</span>
              <span v-if="scope.row.ConsigneeStatus==3">拒收</span>
              <span v-if="scope.row.ConsigneeStatus==4">部分收货</span>
              <span v-if="scope.row.ConsigneeStatus==5">超额到货</span>
            </div>
          </template>
        </el-table-column>
        <el-table-column prop="Ins" label="时间" align="center"></el-table-column>
        <!--<el-table-column label="操作" align="center">
					<template slot-scope="scope">
						<el-button type="primary"  @click="handleDue">处理</el-button>
					</template>
        </el-table-column>-->
      </el-table>
    </section>
  </div>
</template>

<script>
import { fetchList } from "@/api/transaction";

export default {
  data() {
    return {
      formInline: {
        PurchaseNo: "",
        Ins: "",
        ConsigneeStatus: ""
      },
      ConsigneeStatus: [
        {
          value: 1,
          label: "已收货"
        },
        {
          value: 2,
          label: "未收货"
        },
        {
          value: 3,
          label: "拒收"
        },
        {
          value: 4,
          label: "部分收货"
        },
        {
          value: 5,
          label: "超额到货"
        }
      ],

      tableData: [
        {
          PurchaseId: "1",
          PurchaseNo: "3456354634",
          Ins: "2019-04-01",
          ConsigneeStatus: "1"
        },
        {
          PurchaseId: "2",
          PurchaseNo: "1656234532",
          Ins: "2019-04-01",
          ConsigneeStatus: "2"
        },
        {
          PurchaseId: "3",
          PurchaseNo: "3456354634",
          Ins: "2019-04-01",
          ConsigneeStatus: "3"
        },
        {
          PurchaseId: "4",
          PurchaseNo: "1656234532",
          Ins: "2019-04-01",
          ConsigneeStatus: "4"
        },
        {
          PurchaseId: "5",
          PurchaseNo: "3464346846",
          Ins: "2019-04-01",
          ConsigneeStatus: "5"
        }
      ]
    };
  },
  methods: {
    handleDue() {
      this.$router.push({
        path: "/Receiving/receiving"
      });
    }
  }
};
</script>
<style>
</style>